import React from 'react';
import {useParams} from 'react-router-dom';
import type {MenuDataItem} from '@ant-design/pro-layout';
import {connect} from 'react-redux';
// import IframeContent from '@/components/IframeContent';

export const isDev = process.env.NODE_ENV === 'development';

export const host = isDev ? 'http://127.0.0.1' : '';

interface MenuData {
    menuData: MenuDataItem[]
}

const Admin: React.FC<MenuData> = (props) => {
    const menuData: MenuDataItem[] | undefined = props.menuData || [];
    const {id} = useParams();

    let menu: any = null;
    // 递归查找对应菜单地址
    const loopMenuItem = (menus?: MenuDataItem[]) => {
        if (menus && menus.length > 0) {
            // eslint-disable-next-line no-plusplus
            for (let i = 0; i < menus.length; i++) {
                const item = menus[i];
                if (item.id === id) {
                    menu = item;
                    break;
                }
                if (item.routes) {
                    loopMenuItem(item.routes);
                }
            }
        }
    };

    loopMenuItem(menuData);
    console.log('加载菜单页面:', menu);
    if (menu && menu.path) {
        return (
            <micro-app name="app1" url={`${host}/#${menu.path}`} baseroute="/admin/:id"></micro-app>
        );
    }
    return null;
    // <IframeContent key={menu.id} menuid={menu.id} url={`${host}/#${menu.path}`} isLoading/>
};

const mapStateToProps = (state) => {
    const {menuDataReducer} = state;
    return {
        menuData: menuDataReducer.menuData,
    };
};
export default connect(mapStateToProps)(Admin);
